<template>
    <div>
        <div class="common-layout">
            <el-container>
                <el-header>
                    <div style="width: 100px;
        height: 100px; border-radius: 50%; background: blue;"></div>管理员
                </el-header>
                <el-container style="margin-top: 60px;">
                    <el-aside width="400px">
                        <el-row class="tac">
                  
                            <el-col :span="12">
                           
                                <el-menu active-text-color="#ffd04b" background-color="#545c64"
                                    class="el-menu-vertical-demo" default-active="2" text-color="#fff"
                                    @open="handleOpen" @close="handleClose">
                                    <el-sub-menu index="1">
                                        <template #title>
                                            <el-icon>
                                                <location />
                                            </el-icon>
                                            <span>文章管理</span>
                                        </template>
                                        <el-menu-item-group title="Group One">
                                            <el-menu-item index="1-1">item one</el-menu-item>
                                            <el-menu-item index="1-2">item two</el-menu-item>
                                        </el-menu-item-group>
                                        <el-menu-item-group title="Group Two">
                                            <el-menu-item index="1-3">item three</el-menu-item>
                                        </el-menu-item-group>
                                        <el-sub-menu index="1-4">
                                            <template #title>item four</template>
                                            <el-menu-item index="1-4-1">item one</el-menu-item>
                                        </el-sub-menu>
                                    </el-sub-menu>
                                    <el-menu-item index="2">
                                        <el-icon><icon-menu /></el-icon>
                                        <span>Navigator Two</span>
                                    </el-menu-item>
                                    <el-menu-item index="3" disabled>
                                        <el-icon>
                                            <document />
                                        </el-icon>
                                        <span>Navigator Three</span>
                                    </el-menu-item>
                                    <el-menu-item index="4">
                                        <el-icon>
                                            <setting />
                                        </el-icon>
                                        <span>Navigator Four</span>
                                    </el-menu-item>
                                </el-menu>
                            </el-col>
                        </el-row>
                    </el-aside>
                    <el-main>
                        <h3>首页</h3>
                        <p>颠三倒四京东快递经济法激</p>
                        <p>巡店副局级肥肠粉错地方v相存参考课程错</p>
                        <p>代际传递几会计法下课小客车重新小窗口都困得法飞快哪里发现</p>
                        <div style="width: 300px;
                        height: 200px; background-color: aqua; float: left;">12 <p>文章总数</p></div>
                        
                        <div style="width: 300px;
                        height: 200px; background-color: yellow; float: left;">12 <p>文章分类</p></div>
                    </el-main>
                    
                </el-container>
            </el-container>
        </div>
    </div>
</template>

<script setup>

</script>

<style lang="scss" scoped></style>